Skip to content

docs(example): Nuxt Data Fetch #207

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 13 commits into
base: main
Choose a base branch
from
Open

Conversation

alexwpengine
Copy link

@alexwpengine alexwpengine commented May 22, 2025

Description

Ready for review.

  1. Template hierarchy "stolen" from Alex examples (Svelte/Astro).
  2. Mutations are triggered by submitting a comment.
  3. CSR is in Load More in Blog page.
  4. useGraphQL - SSR and CSR.
  5. All imported demo content must be working (any links for routing, buttons, submission, menu items etc.).

Related Issue

closes #174

Type of Change

  • ✅ Bug fix (non-breaking change which fixes an issue)
  • ✨ New feature (non-breaking change which adds functionality)
  • 💥 Breaking change (fix or feature that would cause existing functionality to change)
  • 🧹 Code refactoring (no functional changes)
  • 📄 Example update (no functional changes)
  • 📝 Documentation update
  • 🔍 Performance improvement
  • 🧪 Test update

How Has This Been Tested?

Screenshots

Checklist

  • I have read the CONTRIBUTING document
  • My code follows the project's coding standards
  • I have commented my code, particularly in hard-to-understand areas
  • I have made corresponding changes to the documentation (if applicable)
  • My changes generate no new warnings
  • I have added tests that prove my fix is effective or that my feature works (if applicable)
  • Any dependent changes have been highlighted, merged or published

@alexwpengine alexwpengine requested a review from a team as a code owner May 22, 2025 15:18
@ahuseyn ahuseyn changed the title [Example] Nuxt Data Fetch docs(example): Nuxt Data Fetch May 23, 2025
@ahuseyn
Copy link
Member

ahuseyn commented May 27, 2025

@alexwpengine I had an issue running the example.
These are the steps I've taken:

  1. npm run example:setup
  2. npm run example:start

Here is the result:
Screenshot 2025-05-27 at 15 13 36

 
ℹ Error: [GET] "http://127.0.0.1:63028/__nuxt_vite_node__/manifest": 500 Server Error

 ⁃ at process.processTicksAndRejections (node:internal/process/task_queues:105:5)
 ⁃ at async $fetchRaw2 (node_modules/ofetch/dist/shared/ofetch.03887fc3.mjs:311:14)

   306 ┃          await callHooks(
   307 ┃            context,
   308 ┃            context.options.onResponseError
   309 ┃          );
   310 ┃        }
 ❯ 311 ┃        return await onError(context);
   312 ┃      }
   313 ┃      return context.response;
   314 ┃    };
   315 ┃    const $fetch = async function $fetch2(request, options) {
   316 ┃      const r = await $fetchRaw(request, options);

 ⁃ at async $fetch2 (node_modules/ofetch/dist/shared/ofetch.03887fc3.mjs:316:15)
 ⁃ at async <anonymous> (node_modules/nuxt/dist/core/runtime/nitro/utils/renderer/build-files.js:14:20)
 ⁃ at async Object.render (node_modules/nuxt/dist/core/runtime/nitro/handlers/renderer.js:69:20)
 ⁃ at async Object.handler (node_modules/nitropack/dist/runtime/internal/renderer.mjs:25:22)
 ⁃ (async file://node_modules/h3/dist/index.mjs:2003:19)
 ⁃ at async Object.callAsync (node_modules/unctx/dist/index.mjs:72:16)
 ⁃ at async toNodeHandle (node_modules/h3/dist/index.mjs:2295:7)
 ⁃ at async b (node_modules/node-mock-http/dist/index.mjs:1:6808)

[CAUSE]
FetchError {
  stack: '[GET] "http://127.0.0.1:63028/__nuxt_vite_node__/manifest": 500 Server Error\n' +
  '    at process.processTicksAndRejections (node:internal/process/task_queues:105:5)\n' +
  'at async $fetchRaw2 (./node_modules/ofetch/dist/shared/ofetch.03887fc3.mjs:311:14)\n' +
  'at async $fetch2 (./node_modules/ofetch/dist/shared/ofetch.03887fc3.mjs:316:15)\n' +
  'at async <anonymous> (./node_modules/nuxt/dist/core/runtime/nitro/utils/renderer/build-files.js:14:20)\n' +
  'at async Object.render (./node_modules/nuxt/dist/core/runtime/nitro/handlers/renderer.js:69:20)\n' +
  'at async Object.handler (./node_modules/nitropack/dist/runtime/'... 617 more characters,
  message: '[GET] "http://127.0.0.1:63028/__nuxt_vite_node__/manifest": 500 
  Server Error',
  name: 'FetchError',
  request: [Getter]
  options: [Getter]
  response: [Getter]
  data: [Getter]
  status: [Getter]
  statusCode: [Getter]
  statusText: [Getter]
  statusMessage: [Getter]
}

@alexwpengine
Copy link
Author

@ahuseyn It's fixed. I had some svelte stuff hanging there. I used the svelte and next/client-app-router-fetch-data as examples in this PR.

You can review it briefly and let me know how it is, since I am not 100% ready but I think I'm getting there. I've added some basic styling and I'm trying to make any sample data visible and working (cats, tags, links clickable and routing correctly).

@ahuseyn
Copy link
Member

ahuseyn commented Jun 4, 2025

Thanks @alexwpengine! I'll check ASAP.

@moonmeister
Copy link
Member

moonmeister commented Jun 4, 2025

@alexwpengine, Please respond to and close any review comments. You don't have to implement if you disagree, but please communicate your decisions.

UPDATE: Oops, I never submitted my review. My bad... it's there now

Copy link

changeset-bot bot commented Jun 25, 2025

⚠️ No Changeset found

Latest commit: e0b120d

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@alexwpengine alexwpengine requested a review from moonmeister June 26, 2025 13:58
ahuseyn

This comment was marked as outdated.

@ahuseyn ahuseyn self-requested a review June 27, 2025 12:37
Copy link
Member

@ahuseyn ahuseyn left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice, comprehensive example @alexwpengine! I started it locally with couple of changes which I've submitted as a suggestion. Otherwise looks great!

This one menu item my favorite 😄:
Screenshot 2025-06-27 at 14 45 09

@alexwpengine alexwpengine requested a review from ahuseyn June 27, 2025 15:06
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

example: Fetching data using Nuxt
3 participants